<template>
  <div class="ui-pane">
    <Header></Header>
    <div class="ui-content">
      <yghh-btn circle>hi</yghh-btn>
      <yghh-btn type="primary"></yghh-btn>
      <yghh-btn type="success" @click="opennotice($event)">你好</yghh-btn>
      <yghh-btn type="danger" plain round>hello</yghh-btn>
      <yghh-btn type="warning">hello</yghh-btn>
      <!-- <yghh-msg></yghh-msg> -->
      <pre>
        opennotice(){
          this.$notice({
            msg:"哇哈哈哈哈",
            flag:true
          });
        }
      </pre>
      <!-- <Tree :treeData='treeData'></Tree> -->
      <calendar></calendar>
      <!-- <viewimg :src="src" :isShow="isShow" @closeView="closeImg"></viewimg> -->
      <!-- <div class="flex-center">
        <img style="width: 2rem; display: block;" v-for="(imgsrc,index) in imglist" :src="imgsrc" @click="showimg(imgsrc)">
      </div> -->
      <!-- <imgs></imgs> -->
      <videos :src="vsrc"></videos>
      <goodsspec :isShow="modalIsShow" @closeModal="closeModal"></goodsspec>
      <button @click="modalIsShowclick">按钮</button>
    </div>
  </div>
</template>
<script>
  import Header from '../../components/header.vue'
  import Tree from '../../components/YGHH-Tree.vue'
  // import calendar from '../../components/calendar/calendar.vue'
  import viewimg from '../../components/ViewImg.vue'
  import imgs from '../../components/viewimglist.vue'
  import videos from '../../components/GhVideo.vue'
  import goodsspec from '../../components/GoodsSpec.vue'
  export default {
    data() {
      return {
        modalIsShow:false,
        vsrc: 'http://movie.54xdj.com/20201118313.mp4',
        isShow: false,
        src: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=1135600071,45544589&fm=26&gp=0.jpg',
        imglist: [
          'http://p1.music.126.net/gWTBbLJfla0LT74mwDildA==/109951165477221000.jpg?imageView&quality=89',
          'http://p1.music.126.net/EZCbqP87wGuZ5XcECFRqxg==/109951165477895371.jpg?imageView&quality=89',
          'http://p1.music.126.net/H6sKYEA8-xhhBb8yRkcioA==/109951165477267723.jpg?imageView&quality=89'
        ],
        treeData: {
          tit: '标题',
          list: [{
            tit: 'AAA',
            list: [{
              tit: 'AAA-1'
            }, {
              tit: 'AAA-2',
              list: [{
                tit: 'AAA-2-1'
              }]
            }, {
              tit: 'AAA-3'
            }, {
              tit: 'AAA-4',
              list: [{
                tit: 'AAA-4-1',
              }, {
                tit: 'AAA-4-2',
              }, {
                tit: 'AAA-4-3',
              }]
            }]
          }, {
            tit: 'BBB',
            list: [{
              tit: 'BBB-1'
            }]
          }, {
            tit: 'CCC',
            list: [{
              tit: 'CCC-1'
            }, {
              tit: 'CCC-2'
            }]
          }]
        }
      }
    },
    methods: {
      modalIsShowclick(){
        this.modalIsShow = true;
      },
      closeModal(isjShow){
        console.log(isjShow)
        this.modalIsShow = isjShow;
      },
      opennotice() {
        console.log(event.target.innerText);
        this.$notice({
          msg: event.target.innerText,
          flag: true
        });
      },
      showimg(src) {
        this.src = src;
        this.isShow = true;
      },
      closeImg(sss) {
        this.isShow = false;
        console.log(sss);
      },
    },
    components: {
      Header,
      Tree,
      // calendar,
      viewimg,
      imgs,
      videos,
      goodsspec
    }
  }
</script>

<style>
</style>
